import './App.css';
import axios from './examples/axios.ts';

const serverUrl:string = 'http://localhost:3001';
function App() {

  const handleClick = async () => {
    try {
      
      await axios({
        method: 'get',
        url: `${serverUrl}/base/get`,
        params: {
          foo: ['bar', 'baz']
        }
      })

      await axios({
        method: 'get',
        url: `${serverUrl}/base/get`,
        params: {
          foo: {
            bar: 'baz'
          }
        }
      })
      .then(response => {
        console.log(response.data);
      })

      const date = new Date()
      await axios({
        method: 'get',
        url: `${serverUrl}/base/get`,
        params: {
            date        
        }
      }).then(response => {
        console.log(response.data);
      })
      await axios({
        method: 'get',
        url: `${serverUrl}/base/get`,
        params: {
          foo: '@:$, '
        }
      })

      await axios({                               
        method: 'get',
        url: `${serverUrl}/base/get#hash`,
        params: {
    foo: 'bar'
        }                                                                               
      })

      await axios({
        method: 'get',
        url: `${serverUrl}/base/get?foo=bar`,
        params: {
          foo: 'baz',
          baz: null
        }
      })

    } catch (error) {
      console.error('Error fetching data:', error); // 处理错误
    }
  };

  return (
    <>
      <div>
        <h1>ts-axios examples</h1>
        <ul>
          <li><button onClick={handleClick}>Simple</button></li>
        </ul>
      </div>
    </>
  );
}

export default App;
